<template>
<div>
    <div class="member-box">
        <div class="top">
            <img src="" alt="">
            <span>是否解挂会员卡？</span>
        </div>
        
    </div>
        <div class="text">会员卡号：<span>{{idcard}}</span></div>
        <div  class="text">会员姓名：<span>{{name}}</span></div>
         <span slot="footer" class="dialog-footer">
                <el-button @click="isSolutionToHang = false">取 消</el-button>
                <el-button type="primary" @click=" upmember">确 定</el-button>
            </span>
</div>
    
</template>

<script>
import {
        createNamespacedHelpers
    } from "vuex";
    const {
        mapActions,
    } = createNamespacedHelpers(
        "member"
    );
    export default {
         props: ['id','flag','name','idcard'],
        data() {
            return {
                data:{}
            }
        },
      computed:{
           isSolutionToHang:{
              get(){
               return  this.$store.state.member.isSolutionToHang
              },
              set(val){
                this.$store.state.member.isSolutionToHang = val;
              }
         }
      },
      mounted(){
          
      },
      methods:{
          ...mapActions(['member','searchReceptionistMember']),
          async upmember(){
              const data = await this.member({id:this.id,flag:1})
              console.log('456789',data);
              if(data.status=='200'){
                  this.$message({
                        message: '会员解挂成功',
                        type: 'success'
                    });
                 this.isSolutionToHang=false
                 this.searchReceptionistMember(this.data)
              }
          }
      }
      
    }
</script>

<style lang='scss' scoped>
    .member-box {
        width: 90%;
        /* height: 200px; */
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        align-items: center;
        flex-wrap: wrap;
        .top{
            font-size: 18px;
            font-weight: 800;
        }
    }
  .text{
      font-size: 16px;
      text-align: left;
      padding-left: 210px;
      margin: 10px;
  }
   
</style>